<script setup name="App">
// 组件中如何拿到路由实例呢？
import { computed } from 'vue'
import { useStore } from 'vuex'
const store = useStore()

// 写到这儿的代码其实只执行 1 次，下面写法有问题
/* const money = store.state.money
const double = store.getters.double */
const money = computed(() => {
  // 只要这儿变了
  return store.state.money
})
const double = computed(() => {
  return store.getters.double
})

// 开发中你碰到过什么问题
</script>
<template>
  <div>
    <!-- <p>money: {{ store.state.money }}</p> -->
    <!-- <p>double: {{ store.getters.double }}</p> -->
    <p>money: {{ money }}</p>
    <p>double: {{ double }}</p>
    <button @click="store.commit('changeMoney', 3)">update money</button>
    <button @click="store.dispatch('changeMoneyAsync', 5)">update money async</button>
  </div>
</template>
